<template>
	<view class="">
		<view class="service">
			<view class="serviceItem" v-for="(item, index) in service" :key="index">
				<image :src="imgUrl + item.image" mode=""></image>
				{{item.description}}
			</view>
			<!-- <view class="serviceItem">
				<image src="../static/image/icon2.png" mode=""></image>
				满80减运费
			</view>
			<view class="serviceItem">
				<image src="../static/image/member-icon3.png" mode=""></image>
				7天无理由退货
			</view> -->
		</view>
		<view class="shopNav">
			<view class="shopNavItem" v-for="(item, index) in icon" :key="index">
				<!-- hover-class="none"将点击的时候的默认样式去掉 -->
				<navigator :url="item.link" hover-class="none">
					<image :src="imgUrl + item.image" mode=""></image>
					<text>{{item.title}}</text>
				</navigator>
			</view>
			<!-- <view class="shopNavItem">
				<image src="../static/image/recommend2.png" mode=""></image>
				<text>魅族 16prox</text>
			</view>
			<view class="shopNavItem">
				<image src="../static/image/recommend3.jpg" mode=""></image>
				<text>魅族 16prox</text>
			</view>
			<view class="shopNavItem">
				<image src="../static/image/recommend4.jpg" mode=""></image>
				<text>魅族 16prox</text>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			service:{
				type:Array,
				default(){
					return []
				}
			},
			icon:{
				type:Array,
				default(){
					return []
				}
			}
		},
		data(){
			return{
				imgUrl:this.$imgUrl
			}
		}
	}
</script>

<style>
	.service{
		display: flex;
		height: 70rpx;
		background: #F7F7F7;
		
		align-items: center;
		justify-content: space-around;
	}
	.serviceItem{
		display: flex;
		align-items: center;
		
		font-size: 24rpx;
		color: #3a3a3a;
		line-height: 70rpx;
	}
	.serviceItem image{
		width: 35rpx;
		height: 35rpx;
		margin-right: 10rpx;
	}
	.shopNav{
		height: 225rpx;
		display: flex;
		/* align-items: center; */
		justify-content: space-evenly;
		background-color: #F7F7F7;
	}
	.shopNavItem image{
		width: 100rpx;
		height: 100rpx;
		margin-top: 30rpx;
	}
	.shopNavItem text{
		display: block;
		font-size: 24rpx;
		color: #000000;
		line-height: 100rpx;
	}
</style>
